<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>会员表</title>
<link rel="stylesheet" href="../../js/layui/css/layui.css" media="all" />
<script src="../../js/layui/layui.js"></script>
</head>
<body>
	<blockquote class="layui-elem-quote news_search">
		<form class="layui-form" method="post" onsubmit="return false;">
			<div class="layui-inline">
				<label class="layui-form-mid">会员名:</label>
				<div class="layui-input-inline">
					<input type="text" id="name" name="m_user" placeholder="请输入会员名"
						autocomplete="off" class="layui-input  search_input">
				</div>
			</div>
			<div class="layui-inline">
				<label class="layui-form-mid">手机号:</label>
				<div class="layui-input-inline">
					<input type="text" id="name" name="m_phone" placeholder="请输入手机号"
						autocomplete="off" class="layui-input  search_input">
				</div>
			</div>
			
			<div class="layui-input-inline" style="width: 100px;">
				<button class="layui-btn" lay-submit lay-filter="formDemo">搜索</button>
			</div>
		</form>

	</blockquote>
	<table class="layui-table" id="demo" lay-filter="table"></table>

	<script>
		layui.use(['table','form','layer'], function(){
		  var table = layui.table;
		  var form = layui.form;
		  var layer = layui.layer;
		  
		  //第一个实例
		  table.render({
		    elem: '#demo'
		    ,height: 312
		    ,url: 'http://localhost:8080/FiveClothes/member/findMember' //数据接口
		    ,page: true //开启分页
		    ,limits:[2,3,4]
		    ,cols: [[ //表头
		      {field: 'm_id', title: 'ID'}
		      ,{field: 'm_user', title: '账号'}
		      ,{field: 'm_password', title: '密码'}
		      ,{field: 'm_phone', title: '手机号'}
		      ,{field: 'm_emil', title: '邮箱'}
		    ]]
		    ,id:'idTest'
		  });
		  
		  form.on('submit(formDemo)', function(data){
			  table.reload('idTest', {
				  where:data.field
				  ,page: {
	                    curr: 1 //重新从第 1 页开始
	                  }
				});
			  return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
			});
		});
	 </script>
</body>
</html>